// 写法一

// ; (function (doc) {
//     var items = doc.getElementsByClassName('list-item'),
//         itemsLen = items.length,
//         item,
//         curIdx = 0;

//     for (var i = 0; i < itemsLen; i++) {
//         item = items[i];
//         addEvent(item, 'mouseover', function () {
//             items[curIdx].className = 'list-item';
//             curIdx = Array.prototype.indexOf.call(items, this);
//             items[curIdx].className += ' active';
//         });
//     }
// })(document);


// 写法二

// ; (function (doc) {
//     var oList = doc.getElementsByClassName('list')[0],
//         oitems = doc.getElementsByClassName('list-item'),
//         curIdx = 0;

//     var init = function () {
//         bindEvent();
//     };

//     function bindEvent() {
//         addEvent(oList, 'mouseover', slide);
//     }

//     function slide(e) {
//         var e = e || window.event,
//             tar = e.target || e.srcElement,
//             oParent = getParent(tar, 'li'),
//             thisIdx = Array.prototype.indexOf.call(oitems, oParent);

//         if (curIdx !== thisIdx) {
//             oitems[curIdx].className = 'list-item';
//             oParent.className += ' active';
//             curIdx = thisIdx;
//         }
//     }

//     function getParent(target, element) {
//         while (target.tagName.toLowerCase() !== element) {
//             target = target.parentNode;
//         }
//         return target;
//     }

//     init();
// })(document);



// 写法三
; (function (doc) {
    var oList = doc.getElementsByClassName('list')[0],
        oitems = doc.getElementsByClassName('list-item'),
        curIdx = 0;

    var init = function () {
        bindEvent();
    };

    function bindEvent() {
        addEvent(oList, 'mouseover', function () {
            addEvent(document, 'mousemove', slide);
        });

        addEvent(oList, 'mouseout', function () {
            addEvent(document, 'mousemove', slide);
        });
    }

    function slide(e) {
        var e = e || window.event,
            tar = e.target || e.srcElement,
            oParent = getParent(tar, 'li'),
            thisIdx = Array.prototype.indexOf.call(oitems, oParent);

        if (curIdx !== thisIdx) {
            oitems[curIdx].className = 'list-item';
            oParent.className += ' active';
            curIdx = thisIdx;
        }
    }

    function getParent(target, element) {
        while (target.tagName.toLowerCase() !== element) {
            target = target.parentNode;
        }
        return target;
    }

    init();
})(document);
